<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta content="telephone=no" name="format-detection">
    <title>综合评估</title>
    <script src="../../../js/jquery-1.8.3.min.js"></script>
    <script src="../../../js/mobile.js"></script>
    <script src="../../../js/md5.js"></script>
    <script src="../../../js/requestHelper.js"></script>
    <!-- 根据额外需求引用fix.js -->
    <script src="./js/fix.js"></script>
    
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="./css/evaluation.css">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/ksd.css">
</head>
<script>
    $(function () {
        var hrefarr = typeof window.localStorage.hrefarr !=="undefined"?window.localStorage.hrefarr.split(","):[];
		var prehref=document.referrer;
		if(hrefarr.indexOf(prehref)==-1){
			hrefarr.push(prehref);
		}
		window.localStorage.hrefarr=hrefarr;
		// console.log("我是上一页的地址",hrefarr[0]);
		$(".goindex").on("click",function(){
			//window.location.href = hrefarr[0];
			window.history.back();
        });
        



        var myDate = new Date(),
            today = myDate.getDate(),
            storage = window.localStorage,
            person = "",
            $param = {},
            $data = {};
        if (storage.length != 0) person = JSON.parse(storage.person_info);
        $data.userId = person.userId;
        $data.height = person.height;
        $data.weight = person.weight;
        $data.age = person.age;
        $data.sex = person.sex;
        console.log('你的数据',JSON.stringify($data))
        $param.data = $data;
        var real = "http://mobile.unilifemedia.com/uweb/service/v1/ksd/healthy/getUserHealthyInfo"
        Post(real, $param, function (
            response) {
            // console.log("返回结果", response);
            $("#BmiLevel").text(response.bmi);
            $("#BmiLevel2").text(response.fat + "%");
            $("#bmid").text(response.bmid);
            $("#bodystatus").text(response.bodystatus + "型");
            // $("#ele_heat").text(response.heat);
            $("#ele_heat").contents().filter(function () {
                return this.nodeType == 3;
            })[0].nodeValue = response.heat
            // $("#BmiLevel3").text(response.age + "岁");
            $("#BmiLevel3").contents().filter(function () {
                return this.nodeType == 3;
            })[0].nodeValue = response.age
            $("#weight_range").contents().filter(function () {
                return this.nodeType == 3;
            })[0].nodeValue = response.weight_range
        });
        var top = 0; //给top变量一个初始值，以便下方赋值并引用。
        $(".question").on("click", function () {
            if ($(this).parents(".content").hasClass("content5") || $(this).parents(".content").hasClass(
                    "content6")) {
                $(this).parents(".content").find(".note1").css("top", "1.5rem")
            }

            $(this).parents(".content").find(".note1").toggleClass("none");
            //开启遮罩**************
            $("body").append(`<div class="hide"></div>`);
            var win_h = $("body").height();
            $(".hide").css("height", win_h); //弹出层出现    
            top = $(window).scrollTop(); //获取页面的scrollTop；
            $('body').css("top", -top + "px"); //给body一个负的top值；
            $('body').addClass('add'); //给body增加一个类，position:fixed; 
        });
        $(".note1 div:nth-child(2)").on("click", function () {
            $(this).parent().addClass("none");
            $(".hide").remove(); //弹出层消失
            $('body').removeClass('add'); //去掉给body的类
            $(window).scrollTop(top); //设置页面滚动的高度，如果不设置，关闭弹出层时页面会回到顶部。
        });
        figure_rate("#BmiLevel", "#rate", "#runningball", 30); //bmi 范围是12-42也就是 42-12=30；
        figure_rate("#BmiLevel2", "#rate2", "#runningball2", 40);
        figure_rate("#BmiLevel3", "#rate3", "#runningball3", 50);

        function figure_rate(a, b, c, rate) {
            var bmi = parseInt($.trim($(a).text()).replace("%", "").replace("千卡", "")),
                run_width = 0;
            if (a == "#BmiLevel3") {
                bmi = bmi - 10
            } else if (a == "#BmiLevel") {
                bmi = bmi - 12
            }
            run_width = bmi / rate;
            if (run_width <= 1) {
                var total_width = 6.2;
                var run = (total_width * run_width).toFixed(2);
                $(c).parent().prepend('<div style="position:relative;width:' + run +
                    'rem;height:.05rem;display: inline-block"></div>')
            } else {
                $(c).parent().prepend('<div style="position:relative;width:' + 6.2 +
                    'rem;height:.05rem;display: inline-block"></div>')
            }
        };
        running([6.5, 12, 16], ".bmi_level div", 30);
        running([11, 16, 21, 26], ".fat_level div", 40);
        running([10, 20, 30, 40], ".age_level div", 50);

        function running(arr, div, total) {
            var pdl = ".15rem";
            if (total == 30) pdl = ".3rem";
            for (var i = 0; i < $(div).length; i++) {
                $(div).eq(i).css({
                    "width": (arr[i] / total * 100) + "%",
                    "padding-left": pdl
                });
            }
        };
        $("#back_index").on("click",function(){
            var storage = window.localStorage;
            var person = JSON.parse(storage.person_info);
            window.location.href='homepagehtml.html?userId='+person.userId;
            // localStorage.clear();
            localStorage.removeItem("person_info");
        });
    });
</script>

<body onselectstart="return false;">
    <div class="back">
        <div class="upcore-navbar">
            <span class="upcore-navbar-icon-left goindex"></span>
            <span class="upcore-navbar-name-span">综合评估</span>
            <br style="clear:both">
        </div>
        <div class="content content1">
            <div>
                <div style="height: 3.05rem;">
                    <div class="circle1"></div>
                    <div class="circle2"></div>
                    <div class="circle3">
                        <p id="bmid">98</p>
                        <p>分</p>
                    </div>
                </div>
                <div><button id="back_index" class="btn_evaluation">重新评测</button></div>
                <div class="content1_detail">
                    <span>S级:<span>96~100</span>分;</span>
                    <span>A级:<span>86~95</span>分;</span>
                    <span>B级:<span>76~85</span>分;</span>
                    <span>C级:<span>61~75</span>分;</span>
                    <span>D级:<span>0~60</span>分;</span>
                </div>
            </div>
        </div>
        <div class="content content2">
            <div class="content2_bmi"><span>BMI</span> <img id="img1" src="images/pic1.png" class="fr question" alt="无"></div>
            <div class="note1 none">
                <div>BMI 指数，即身体质量指数，是目前国际上常用的衡量人体胖瘦程度以及是否健康的一个标准。</div>
                <div>我知道了</div>
            </div>
            <div id="BmiLevel" class="content_nbr">0</div>
            <div class="content_level bmi_block_name">
                <div>偏轻</div>
                <div>健康</div>
                <div>微胖</div>
                <div>需减肥</div>
            </div>
            <div id="rate">
                <div class="rate_run">
                    <div id="runningball" class="run_circle">
                        <div></div>
                    </div>
                </div>
                <div class="bmi_block">
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                </div>
            </div>
            <div class="content_nbr_level bmi_level level">
                <div>18.5</div>
                <div>24</div>
                <div>28</div>
            </div>
        </div>
        <div class="content content3">
            <div class="content2_bmi"><span>体脂率</span> <img src="images/pic1.png" class="fr question" alt="无"></div>
            <div class="note1 none">
                <div>体脂率是指人体内脂肪重量在人体总重量重所占的比例，又称体脂百分数，它反映人体内脂肪含量的多少。</div>
                <div>我知道了</div>
            </div>
            <div id="BmiLevel2" class="content_nbr">1%</div>
            <div class="content_level">
                <div style="width:1.645rem">瘦</div>
                <div style="width:.715rem">偏瘦</div>
                <div style="width:.715rem">标准</div>
                <div style="width:.715rem">微胖</div>
                <div style="width:2.11rem">肥胖</div>
            </div>
            <div id="rate2">
                <div class="rate_run">
                    <div id="runningball2" class="run_circle">
                        <div></div>
                    </div>
                </div>
                <div class="fat_block">
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                </div>
            </div>
            <div class="content_nbr_level fat_level level">
                <div>11</div>
                <div>16</div>
                <div>21</div>
                <div>26</div>
            </div>
        </div>
        <div class="content content4">
            <p>综合BMI和体脂率，你的身材属于</p>
            <p id="bodystatus">紧致型</p>
            <p>健康体重范围</p>
            <p id="weight_range">48.0 ~ 62.2 <span>公斤</span></p>
            <p>注：不适用于孕妇或运动员</p>
        </div>
        <!-- <div class="content content5">
            <div class="content5_bmi"><span>我显年轻么？</span></div>
            <div class="content5_nbr"><span>身体年龄</span><img src="images/pic1.png" class="fr question" alt="无"></div>
            <div class="note1 none">
                <div>身体年龄是综合体重、身体脂肪率等多种指数计算后的出的，它是一个高于或者低于实际年龄的综合判断身体状况的标准。</div>
                <div>我知道了</div>
            </div>
            <div id="BmiLevel3" class="content_nbr">24
                <span>岁</span>
            </div>
            <div class="content_level bmi_block_name" style="margin: 0">
                <div>　</div>
                <div></div>
                <div></div>
                <div></div>
            </div>
            <div id="rate3">
                <div class="rate_run">
                    <div id="runningball3" class="run_circle">
                        <div></div>
                    </div>
                </div>
                <div class="age_block">
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                </div>
            </div>
            <div class="content_nbr_level age_level level">
                <div>20</div>
                <div>30</div>
                <div>40</div>
                <div>50</div>
            </div>
        </div> -->
        <div class="content content5">
            <div class="content5_bmi"><span>我显年轻么？</span></div>
            <div class="content5_nbr"><span>身体年龄</span><img src="images/pic1.png" class="fr question" alt="无"></div>
            <div class="note1 none">
                <div>身体年龄是综合体重、身体脂肪率等多种指数计算后的出的，它是一个高于或者低于实际年龄的综合判断身体状况的标准。</div>
                <div>我知道了</div>
            </div>
            <div id="BmiLevel3" class="content_nbr">19
                <span>岁</span>
            </div>
            <div class="content_level" style="margin: 0">
                <div style="width:1.645rem"></div>
                <div style="width:.715rem"></div>
                <div style="width:.715rem"></div>
                <div style="width:.715rem"></div>
                <div style="width:2.11rem"></div>
            </div>
            <div id="rate3">
                <div class="rate_run">
                    <div id="runningball3" class="run_circle">
                        <div></div>
                    </div>
                </div>
                <div class="age_block">
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                </div>
            </div>
            <div class="content_nbr_level age_level level">
                <div>20</div>
                <div>30</div>
                <div>40</div>
                <div>50</div>
            </div>
        </div>
        <div class="content content6">
            <div class="content5_bmi"><span>我该怎么吃？</span></div>
            <div class="content2_bmi"><span>预算热量</span><img src="images/pic1.png" class="fr question" alt="无"></div>
            <div class="note1 none">
                <div>预算热量是根据你的身体情况，你的目标，每天应该摄入的热量。</div>
                <div>我知道了</div>
            </div>
            <div class="content_nbr" style="width:auto"><span id="ele_heat">1428</span><span>千卡</span></div>
            <div><button class="btn_evaluation" id="cat_diet" onclick="window.location.href='plan_diet.html'">查看饮食计划</button></div>
            <div>
                <!-- <p><img class="warning" src="images/pic2.png" alt="无">预算热量是根据你的身体情况，你的目标，每天应该摄入的热量。</p> -->
                <p>不用过于精确，在 <span style="color:#F5A623">1333 ~ 1630</span> 千卡范围内都是合理的。</p>
                <p>根据您的预算热量，我们为您制定了一周的食谱，以供参考。</p>
            </div>
        </div>
    </div>
</body>

</html>